<template>
    <div>


        <el-card>
            <el-table
                    :data="rightList"
                    style="width: 100%"
                    border
                    stripe
            >
                <el-table-column
                        label="序号"
                        width="80"
                        type="index"
                >
                </el-table-column>
                <el-table-column
                        prop="authName"
                        label="权限名称"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="path"
                        label="路径"
                        width="180"
                >
                </el-table-column>


                <el-table-column
                        prop="icon"
                        label="图标"
                        width="100"
                >
                    <template slot-scope="scope">
                        <i :class="[scope.row.icon]"></i>
                    </template>
                </el-table-column>


                <el-table-column
                        prop="tag"
                        label="权限等级"
                        width="150"
                >
                    <template slot-scope="scope">
                        <el-tag v-if="scope.row.level ==0" type="primary">一级菜单</el-tag>
                        <el-tag v-if="scope.row.level ==1" type="success">二级菜单</el-tag>
                        <el-tag v-if="scope.row.level ==2" type="warning">三级菜单</el-tag>
                    </template>
                </el-table-column>
                <el-table-column
                        label="操作"
                        width="180"
                ><p>后期完成</p>
                </el-table-column>
            </el-table>

        </el-card>

    </div>
</template>

<script>
    export default {
        name: "rights"
        ,data(){
            return{
                rightList:[]
            }
        },
        created() {
            this.getRightList()
        },
        methods:{
            async getRightList(){

             let {data:res} =await  this.$http('rights/list')
                if (res.meta.status != 200) return Message.error(res.meta.msg)

                this.rightList=res.data
               console.log(res)
            }
        }
    }
</script>

<style scoped>

</style>
